<!--
 * @Author: Y先森
 * @Date: 2023-05-09 10:31:16
 * @LastEditors: y && 250048395@qq.com
 * @LastEditTime: 2023-05-10 11:17:06
 * @FilePath: \y-website\src\views\creation\components\pages\note\index.vue
-->
<template>
  <div class="note scrollbar-none" :class="className">
    <div class="text-base font-semibold pb-3 title">日记</div>
    <div class="relative w-full">
      <div class="note-li pb-6 flex dark:bg-indigo-dark-d" :class="className == 'one' ? 'bg-zinc-50 rounded p-3 mb-3' : ''">
        <div class="text-zinc-300 mr-1 text-right flex flex-col" :class="className == 'one' ? 'mr-3' : 'mr-1'">
          <span class="text-lg font-semibold mb-[0.4rem] dark:text-indigo-dark-l">2022</span>
          <span class="text-sm text-zinc-900 dark:text-indigo-dark-l">04/10</span>
        </div>
        <div>
          <div class="text-base duration-500 font-semibold mb-1">周一上班早</div>
          <div class="leading-[0.7]">
            <span class="text-sm"
              >早安
              ，新的一周开始了，新的一天也刚开始。所以抛去昨天懒惰的周末情绪，饱满的投入到今天的事情当中，就有，一切的计划都要按计划去走，一步一步到达计划花开时。早安。加油！</span
            >
          </div>
        </div>
      </div>
      <div class="note-li pb-6 flex dark:bg-indigo-dark-d" :class="className == 'one' ? 'bg-zinc-50 rounded p-3 mb-3' : ''">
        <div class="text-zinc-300 mr-1 text-right flex flex-col" :class="className == 'one' ? 'mr-3' : 'mr-1'">
          <span class="text-lg font-semibold mb-[0.4rem] dark:text-indigo-dark-l">2022</span>
          <span class="text-sm text-zinc-900 dark:text-indigo-dark-l">04/10</span>
        </div>
        <div>
          <div class="text-base duration-500 font-semibold mb-1">周一上班早</div>
          <div class="leading-[0.7]">
            <span class="text-sm"
              >早安
              ，新的一周开始了，新的一天也刚开始。所以抛去昨天懒惰的周末情绪，饱满的投入到今天的事情当中，就有，一切的计划都要按计划去走，一步一步到达计划花开时。早安。加油！</span
            >
          </div>
        </div>
      </div>
      <div class="note-li pb-6 flex dark:bg-indigo-dark-d" :class="className == 'one' ? 'bg-zinc-50 rounded p-3 mb-3' : ''">
        <div class="text-zinc-300 mr-1 text-right flex flex-col" :class="className == 'one' ? 'mr-3' : 'mr-1'">
          <span class="text-base font-semibold mb-[0.4rem] dark:text-indigo-dark-l">2022</span>
          <span class="text-sm text-zinc-900 dark:text-indigo-dark-l">04/10</span>
        </div>
        <div>
          <div class="text-lg duration-500 font-semibold mb-1">周一上班早</div>
          <div class="leading-[0.7]">
            <span class="text-sm"
              >早安
              ，新的一周开始了，新的一天也刚开始。所以抛去昨天懒惰的周末情绪，饱满的投入到今天的事情当中，就有，一切的计划都要按计划去走，一步一步到达计划花开时。早安。加油！</span
            >
          </div>
        </div>
      </div>
    </div>
  </div>
</template>

<script setup>
defineProps({
  className: {
    type: String,
    default: ''
  }
})
</script>
<style scoped lang="scss">
.title {
  display: block;
}
</style>
